define(["ui", "drag", "scroll"], function (ui, drag, scroll, Lyx) {

	var nextMsg = function () {
		if (this.msgQueue.length != 0) {
			this.theme.fillMsg.apply(this.theme, this.msgQueue.dequeue());
			return true;
		}
		return false;
	}

	var alert = Lyx.createClass(function (p2t) {
		p2t.init = function (theme) {
			this.theme = theme;

			this.status = false;

			this.msgQueue = Lyx.queue();

			this.status = false;

			if (!Lyx.isUndefined(theme.button)) {
				if (!Lyx.isUndefined(theme.button.ok)) {
					ui.hander.add(theme.button.ok, "click", function (event) {
						ui.stop(event);
						theme.callback.ok.call(theme) ? this.hide() : "";
					}.bind(this));
				}

				if (!Lyx.isUndefined(theme.button.cancel)) {
					ui.hander.add(theme.button.cancel, "click", function (event) {
						ui.stop(event);
						theme.callback.cancel.call(theme) ? this.hide() : "";
					}.bind(this));
				}
			}

			ui.hander.add(this.theme.background, "click", this.hide.bind(this));
		}

		p2t.msg = function (msg) {
			if (this.status) {
				this.msgQueue.enqueue(arguments);
			}
			else {
				this.theme.fillMsg.apply(this.theme, arguments);
				this.show.call(this);
			}
		}

		p2t.show = function () {
			this.status = true;
			this.theme.show();
		}

		p2t.hide = function () {
			if (!nextMsg.call(this)) {
				this.status = false;
				this.theme.hide();
			}
		}
	});

	alert.theme = {
		default: Lyx.createClass(function (p2t) {
			p2t.init = function (config) {
				Lyx.extend(this, config);
				this.background = ui.addNode(ui.$("body[0]"), "div", "innerEnd", {
					style: {
						position: "fixed",
						left: 0,
						top: 0,
						bottom: 0,
						right: 0,
						zIndex: 2000,
						display: "flex",
						visibility: "hidden",
						justifyContent: "center",
						alignItems: "center",
						webkitPerspective: 150,
						backgroundColor: "rgba(0, 0, 0, 0)"
					}
				});

				// 弹出的窗口
				this.window = ui.addNode(this.background, "div", "innerFirst", {
					style: {
						left: 0,
						top: 0,
						bottom: 0,
						right: 0,
						position: "relative",
						opacity: 0,
						borderRadius: 4,
						transform: "scale(0.7)",
						boxShadow: "0px 0px 20px 0px rgba(0, 0, 0, 0.56)"
					}
				});

				this.title = ui.addNode(this.window, "div", "innerFirst", {
					style: {
						borderRadius: "4px 4px 0 0",
						padding: "20px 10px 0px 20px",
						background: "#fff",
						fontSize: 20,
						fontWeight: 600
					}
				});

				this.scrollBox = ui.addNode(this.window, "div", "innerEnd", {
					style: {
						padding: "10px 20px 10px 20px",
						background: "#fff",
						width: 200,
						letterSpacing: 1,
						maxHeight: 120,
					}
				});
				
				this.box = ui.addNode(this.scrollBox, "div", "innerFirst");

				this.content = ui.addNode(this.box, "div", "innerFirst");
				this.roll = new scroll(this.scrollBox, {
					mouseover: true,
					yMouseover: true,
					yBarSwitch: true,
					dragSwitch: false,
				});

				
				this.tail = ui.addNode(this.window, "div", "innerEnd", {
					style: {
						borderRadius: "0 0 4px 4px",
						padding: "10px 10px 15px 20px",
						background: "#fff"
					}
				});

				this.button = {
					ok: ui.addNode(this.tail, "div", "innerFirst"),
					cancel: ui.addNode(this.tail, "div", "innerFirst"),
				};

				ui.css([this.button.ok, this.button.cancel], {
					float: "right",
					background: "#8BC34A",
					color: "#fff",
					borderRadius: 4,
					width: 60,
					margin: "10px 20px 10px 10px",
					textAlign: "center",
					height: 36,
					lineHeight: 36,
					cursor: "pointer",
					display: "none"
				});
				this.button.ok.innerHTML = "确定";
				this.button.cancel.innerHTML = "取消";
			}

			p2t.clear = function () {
				this.title.innerHTML = "";
				this.button.ok.innerHTML = "确定";
				this.button.cancel.innerHTML = "取消";
			}

			p2t.fillMsg = function (msg, options, callback) {
				this.clear();
				this.content.innerHTML = msg;
				if (Lyx.type(options) === "function") {
					callback = options;
					options = {};
				}
				options = options || {};
				if (options.title) {
					this.title.innerHTML = options.title;
				}
				if (callback) {
					if (options.button) {
						this.button.ok.innerHTML = options.button.ok || "确定";
						this.button.cancel.innerHTML = options.button.cancel || "取消";
					}
					ui.css([this.button.ok, this.button.cancel], {
						display: ""
					});
					ui.css(this.tail, {
						height: 50
					});
					this.callbackTemp = callback;
				}
				this.roll.y = 0;
			}

			p2t.show = function () {
				ui.css(this.window, {
					transition: ".3s",
					opacity: 1,
					transform: "scale(1)",
				});
				this.background.style.visibility = "";
				this.background.style.backgroundColor = "rgba(0, 0, 0, 0.7)";
			}

			p2t.hide = function () {
				ui.css(this.window, {
					transition: "",
					transform: "scale(0.7)",
					opacity: 0
				});
				if (this.callbackTemp) {
					this.callbackTemp(false);
					this.callbackTemp = undefined;
				}
				this.background.style.visibility = "hidden";
				this.background.style.backgroundColor = "rgba(0, 0, 0, 0)";
			}

			p2t.callback = {
				ok: function () {
					if (this.callbackTemp) {
						this.callbackTemp(true);
						this.callbackTemp = undefined;
					}
					return true;
				},
				cancel: function () {
					if (this.callbackTemp) {
						this.callbackTemp(false);
						this.callbackTemp = undefined;
					}
					return true;
				}
			}
		}),
	};
	return alert;
});
